<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米商城</title>
    <!-- <link rel="stylesheet" href="../作业/common.css"> -->
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2744067_9w2lswsgmp.css">
    <link rel="stylesheet" href="小米.css">
</head>
<body>
    <div class="site-topbar">
        <div class="w">
            <ul class="topbar-nav">
                <li>
                    <a href="//www.mi.com/index.html">小米商城</a>
                </li>
                <li>
                    <a href="//www.miui.com/">MIUI</a>
                </li>
                <li>
                    <a href="//www.miui.com/">loT</a>
                </li>
                <li>
                    <a href="//i.mi.com/">云服务</a>
                </li>
                <li>
                    <a href="//airstar.com/home">天星数科</a>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">有品</a>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">小爱开放平台</a>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">企业团购</a>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">资质证照</a>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">协议规则</a>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">下载app</a>
                    <div class="appcode"></div>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">智能生活</a>
                </li>
                <li>
                    <a href="//www.mi.com/index.html">Select Location</a>
                </li>
            </ul>
            <div class="topbar-cart">
                <a href="">
                    <em class="iconfont icon-gouwuche"></em>
                    <span>购物车&ensp;(0)</span>
                </a>
                <div class="msg-empty">购物车中还没有商品，赶快选购吧！</div>
            </div>
            <div class="topbar-info">
                <ul>
                <li>
                    <a href="">登入</a>
                    <span>|</span>
                </li>
                <li>
                    <a href="">注册</a>
                    <span>|</span>
                </li>
                <li>
                    <a href="">消息通知</a>
                </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="site-header">
        <div class="w">
            <div class="logo">
                
            </div>
            <div></div>
            <div></div>
        </div>
    </div>
    <div class="banner">
        <div class="w">
            <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/bd166252b080dcab7b5f5382a921171a.jpg?w=2452&h=920" alt="">
            <ul class="list">
                <li>
                    <a href="">手机 电话卡</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">1</div>
                </li>
                <li>
                    <a href="">电视盒子</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">2</div>
                </li>
                <li>
                    <a href="">笔记本 平板</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">3</div>
                </li>
                <li>
                    <a href="">家电 插线板</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">4</div>
                </li>
                <li>
                    <a href="">出行 穿戴</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">5</div>
                </li>
                <li>
                    <a href="">智能 路由器</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">6</div>
                </li>
                <li>
                    <a href="">电源 配件</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">7</div>
                </li>
                <li>
                    <a href="">健康 儿童</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">8</div>
                </li>
                <li>
                    <a href="">耳机 音箱</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">9</div>
                </li>
                <li>
                    <a href="">生活 背包</a>
                    <em class="iconfont icon-a-jiantou"></em>
                    <div class="genre">10</div>
                </li>
            </ul>
        </div>
    </div>
    <div class="home-hero">
        <!-- <div class="w"> -->
            <div class="span4">
                <ul class="clearfix">
                    <li>
                        <a href="">
                            <span class="iconfont icon-shizhong"></span>
                        </a>
                        <p>保障服务</p>
                    </li>
                    <li>
                        <a href="">
                            <span class="iconfont icon-qiye"></span>
                        </a>
                        <p>企业团购</p>
                    </li>
                    <li>
                        <a href="">
                            <span class="iconfont icon-Fma"></span>
                        </a>
                        <p>F码通行</p>
                    </li>
                    <li>
                        <a href="">
                            <span class="iconfont icon-dianhuaka"></span>
                        </a>
                        <p>米粉卡</p>
                    </li>
                    <li>
                        <a href="">
                            <span class="iconfont icon-danbijiaoyiqingsuan"></span>
                        </a>
                        <p>以旧换新</p>
                    </li>
                    <li>
                        <a href="">
                            <span class="iconfont icon-huafeichongzhi"></span>
                        </a>
                        <p>话费充值</p>
                    </li>
                </ul>
            </div>
            <div class="span16">
                <ul>
                    <li>
                        <a href="https://www.mi.com/buy/detail?product_id=12511" target="_blank">
                            <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/5d4298059889417157e8492750328492.jpg?w=632&h=340" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://www.mi.com/mi11" target="_blank">
                            <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/b30177d629bfbe2fb42251c1b8538f7b.jpg?w=632&h=340" alt="">
                        </a>
                    </li>
                    <li>
                        <a href="https://www.mi.com/flipbudspro" target="_blank">
                            <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/9f18ac756fa2cedb16ea429b9c0001af.png?w=632&h=340" alt="">
                        </a>
                    </li>
                </ul>
            </div>
        <!-- </div> -->
    </div>
    <div class="home-banner-box">
        <!-- <div class="w"> -->
            <a href="https://www.mi.com/redmik40">
                <img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/f334fbd05d5681bb838fefd1c815d88c.jpg?thumb=1&w=1533&h=150&f=webp&q=90" alt="">
            </a>
        <!-- </div> -->
    </div>
    <div class="box-hd">
        <div class="title">
            <h2>手机</h2>
        </div>
        <div>
            <a href="" class="more">
                查看更多
            </a>
        </div>
    </div>
</body>
</html>